<template>
	<view class="container">
		<form>
			<view class="cu-form-group margin-top-xs">
				<view class="title">收货人</view>
				<input v-model="fromData.name" placeholder="姓名" name="input" />
			</view>
			<view class="cu-form-group">
				<view class="title">手机号码</view>
				<input v-model="fromData.phone" placeholder="手机号" name="input" />
				<view class="cu-capsule radius">
					<view class='cu-tag bg-blue '>
						+86
					</view>
					<view class="cu-tag line-blue">
						中国大陆
					</view>
				</view>
			</view>
			<view class="cu-form-group">
				<view class="title">所在区域</view>
				<picker mode="region" @change="RegionChange" :value="region">
					<view class="picker">
						{{region[0]}}，{{region[1]}}，{{region[2]}}
					</view>
				</picker>
			</view>
			<view class="cu-form-group align-start">
				<view class="title">详细地址</view>
				<textarea v-model="fromData.address" maxlength="-1" @input="textareaInput"
					placeholder="小区楼栋/乡村名称"></textarea>
				<text class='cuIcon-locationfill text-orange'></text>
			</view>
			<view class="padding flex flex-direction">
				<button @click="handleClick" class="cu-btn bg-gradual-blue lg">保存</button>
				<button @click="handleClick" class="cu-btn margin-top bg-grey lg">删除</button>
			</view>
		</form>
	</view>
</template>

<script setup lang="ts">
	import {
		ref
	} from 'vue';
	import {
		useSettingStore
	} from '@/stores/index';
	import {
		onLoad
	} from '@dcloudio/uni-app';
	const setting = useSettingStore();
	const fromData: any = ref({
		name: '',
		phone: setting.userInfo.phone,
		address: ''
	});
	const region = ref(['广东省', '广州市', '海珠区'])
	const onInfo = async () => {
		
	};
	let isRead = false;
	/**
	 * 点击事件
	 */
	const handleClick = async () => {
		if (!isRead) {
			uni.showToast({
				title: '请勾选阅读协议',
				duration: 2000,
				icon: 'error'
			});
			return
		}
		
	};
	const textareaInput = (e: any) => {
		fromData.value.address = e.detail.value
	}
	const RegionChange = (e: any) => {
		region.value = e.detail.value
	}
	onLoad(prop => {
		if (prop.code && prop.code.length > 0) {
			fromData.value.invitationCode = prop.code;
		}
		onInfo();
	});
</script>

<style></style>
